<template>
    <h2>显示病房列表</h2>
    病房名称<input type="text" v-model="WardName">
    科室:<select v-model="KeiShiId">
        <option :value="0">--请选择--</option>
        <option v-for="item in Kei" :value="item.KeiShiId">{{ item.KeiShiName }}</option>
    </select>
    <input type="button" value="查询" @click="LoDta" style="margin-left: 20px;">
    <input type="button" value="批量修改状态" @click="Upd">
    <table border="1">
        <thead>
            <tr>
                <td><input type="checkbox" v-model="quan" @change="qAll"></td>
            <td>病房编号</td>
            <td>病房名称</td>
            <td>病房床位</td>
            <td>空床位</td>
            <td>科室名称</td>
            <td>病房状态</td>
            <td>操作</td>
        </tr>
        </thead>
        <tbody>
           
            <tr v-for="item in info">
                <td><input type="checkbox" v-model="newArry" :checked="fan" :value="item.WardId" @change="fAll"></td>
            <td>{{item.WardId}}</td>
            <td>{{item.WardName}}</td>
            <td>{{item.WardBedNum}}</td>
            <td>{{item.KongBedNum}}</td>
            <td>{{item.KeiShiName}}</td>
            <td>{{item.WardState==true?"启用":"维修"}}</td>
            <td>操作
                <a style="margin-right: 20px;" @click="UpdState(item.WardId)">修改状态</a>
            </td>
        </tr> 
        </tbody>
        
    </table>
    当前共{{ pageInfo.totalcount }}条,当前页共{{ pageInfo.pageSize }}条
当前页共{{ pageInfo.pageIndex }}/{{ pageInfo.pagecount }}页
<span>
    <a style="margin-right: 20px;" @click="pageChan('F')">首页</a>
    <a style="margin-right: 20px;" @click="pageChan('U')">上一页</a>
    <a style="margin-right: 20px;" @click="pageChan('N')">下一页</a>
    <a style="margin-right: 20px;" @click="pageChan('E')">尾页</a>
</span>
</template>
<script setup lang="ts">
import axios from "axios";
import { onMounted,ref } from "vue";


const quan=ref(false);
const fan=ref(false);
const newArry=ref([]);

const qAll=()=>{
    if(quan.value==true){
        fan.value=true;
        newArry.value=info.value.map((item:any)=>{
            
            return item.WardId

        })
    }
    else{
        fan.value=false
        newArry.value=[]
    }
}

const fAll=()=>{
    if(newArry.value.length==info.value.length){
        quan.value=true;
    }
    else{
        quan.value=false;
    }
}



const Upd=()=>{
    if(confirm("你确定要修改吗?")){
        axios.get('https://localhost:7133/api/Ward/UpdState',
        {
            params:{
                ids:newArry.value.toString()
            }
        }
        
        )
        .then(res=>{
            if(res.data>0){
                alert("修改成功");
                LoDta();
            }
            else{
                alert("修改失败");
            }
        })
    }
}



const UpdState=(Wid:number)=>{
    if(confirm("你确定要修改吗?")){
        axios.get('https://localhost:7133/api/Ward/UpdateState',
        {
            params:{
                WardId:Wid
            }
        }
        
        )
        .then(res=>{
            if(res.data>0){
                alert("修改成功");
                LoDta();
            }
            else{
                alert("修改失败");
            }
        })
    }

}


const WardName=ref("");
const KeiShiId=ref(0);


const pageInfo=ref({
    pageIndex:1,
    pageSize:2,
    totalcount:0,
    pagecount:0
})

const info:any=ref([{
    WardId:0,
    KeiShiId:0,
    WardName:"",
    WardBedNum:"",
    KongBedNum:"",
    KeiShiName:"",
    WardState:true

}])

const Kei=ref([{
    KeiShiId:0,
    KeiShiName:""

}])

//下拉框
onMounted(()=>{
    Lodata();
    LoDta();
})

const Lodata=()=>{
    axios.get('https://localhost:7133/api/Ward/GetKeiShis')
    .then(res=>{
        Kei.value=res.data
    })
}

//加载数据
const LoDta=()=>{
    axios.get('https://localhost:7133/api/Ward/ShowWard',
    {
        params:{
            WardName:WardName.value,
            KeiShiId:KeiShiId.value,
            pageIndex:pageInfo.value.pageIndex,
            pageSize:pageInfo.value.pageSize


        }
    }
    )
    .then(res=>{
        pageInfo.value.totalcount=res.data.TotalCount;
        pageInfo.value.pagecount=res.data.PageCount;
        info.value=res.data.Data_Info;
    })
}

//分页
const pageChan=(choose:string)=>{
    switch(choose){
        case 'F':
            pageInfo.value.pageIndex=1;
            break;
            case 'U':
            pageInfo.value.pageIndex=pageInfo.value.pageIndex-1;
            break;
            case 'N':
            pageInfo.value.pageIndex=pageInfo.value.pageIndex+1;
            break;
            case 'E':
            pageInfo.value.pageIndex=pageInfo.value.pagecount;
            break;
    }
    LoDta();

}

</script>